<template>
  <base-view :model="query" @submit="search" class="custom" :paramsLayout="true">
    <template v-slot:params>
      <a-col :span="8">
        <a-form-item label="证件类型">
          <a-select placeholder="请选择证件类型" v-model="query.certType">
            <a-select-option value="01">身份证</a-select-option>
            <a-select-option value="02">军官证</a-select-option>
            <a-select-option value="03">护照</a-select-option>
            <a-select-option value="04">户口薄</a-select-option>
            <a-select-option value="05">士兵证</a-select-option>
            <a-select-option value="06">港澳来往内地通行证</a-select-option>
            <a-select-option value="07">台湾同胞来往内地通行证</a-select-option>
            <a-select-option value="08">临时身份证</a-select-option>
            <a-select-option value="09">外国人居留证</a-select-option>
            <a-select-option value="99">其他</a-select-option>
          </a-select>
        </a-form-item>
      </a-col>

      <a-col :span="8">
        <a-form-model-item label="证件号码">
          <a-input
            placeholder="证件号码"
            v-model="query.certNo"
          />
        </a-form-model-item>
      </a-col>

      <a-col :span="8">
        <a-form-model-item label="签约账号">
          <a-input
            v-model="query.signAcctNo"
            placeholder="输入签约账号"
          />
        </a-form-model-item>
      </a-col>

      <a-col :span="24">
        <a-form-model-item class="search">
          <a-button type="primary" html-type="submit">搜索</a-button>
          <a-button style="margin-left: 8px" html-type="reset" @click="reset">重置</a-button>
        </a-form-model-item>
      </a-col>

    </template>

      <a-table
        ref="table"
        :columns="columns"
        :dataSource="dataSource"
        :rowKey="
          (record, index) => {
            return index;
          }
        "
        @change="pageChange"
        @showSizeChange="pageChange"
        :loading="loading"
        :pagination="pagination"
        :scroll="{ x: 1500 }"
      >
        <template slot="operation" slot-scope="text, record">
          <a-icon type="delete" theme="twoTone" twoToneColor="#4a9ff5" title="解约" v-if="record.signStatus !== 'N'" @click="rescind(record)" ></a-icon>
        </template>
      </a-table>
    <a-modal
      v-model="modalVisible"
      :title="modalTitle"
      width="1050px"
      @ok="submit"
      :maskClosable="false"
      :footer="isHideFoot?null:undefined"
    >
      <mchnt-level-operation ref="modalForm" />
    </a-modal>
  </base-view>
</template>

<script>

  export default {
  name: "SignAcct",
    data() {
      return {
        form: this.$form.createForm(this),
        beanInfo: {},
        modalVisible: false,
        isHideFoot: false,
        modalTitle: "",
        query: { instId: "",certNo : "",signAcctNo : "" ,certType : "",signStatus:"",signToken:"",signTokenType:"",signInst:""},
        loading: false,
        pagination: {
          pageNum: 1,
          pageSize: 10,
          pageSizeOptions: ["10", "20", "30", "40", "100"],
          defaultCurrent: 1,
          defaultPageSize: 10,
          showQuickJumper: true,
          showSizeChanger: true,
          showTotal: (total, range) =>
            `显示 ${range[0]} ~ ${range[1]} 条记录，共 ${total} 条记录`,
        },
        columns: [
          {
            title: "法人行",
            dataIndex: "instId",
            width: 80,
          },
          // {
          //   title: "用户编号",
          //   dataIndex: "userId",
          //   hidden: true
          // },
          {
            title: "签约标记号",
            dataIndex: "signToken",
            width: 150,
          },
          {
            title: "签约标记类型",
            dataIndex: "signTokenType",
            width: 150,
            customRender: function (text, row, index) {
              switch (text) {
                case '00':
                  return '银联全渠道无跳转支付业务'
                case '01':
                  return '银联全渠道代收业务'
                case '02':
                  return '银联全渠道代付业务'
                case '03':
                  return '银联无卡快捷支付业务'
                case '04':
                  return '网联协议支付业务'
                case '05':
                  return '本行快捷支付业务'
                case '06':
                  return '钱包支付业务'
                case '07':
                  return '无感支付停车收费业务'
                default:
                  return '';
              }
            }
          },
          {
            title: "签约标记主体",
            dataIndex: "signTokenInst",
            width: 100,
          },
          {
            title: "签约类型",
            dataIndex: "signType",
            width: 120,
            customRender: function (text, row, index) {
              switch (text) {
                case '00':
                  return '银行级签约'
                case '01':
                  return '平台级签约'
                case '02':
                  return '商户级签约'
                default:
                  return '';
              }
            }
          },
          {
            title: "签约主体",
            dataIndex: "signInst",
            width: 80,
          },
          {
            title: "持卡人姓名",
            dataIndex: "cardHoldName",
            width: 80,
          },
          {
            title: "证件类型",
            dataIndex: "certType",
            width: 80,
            customRender: function (text, row, index) {
              switch (text) {
                case '01':
                  return '身份证'
                case '02':
                  return '军官证'
                case '03':
                  return '护照'
                case '04':
                  return '户口薄'
                case '05':
                  return '士兵证'
                case '06':
                  return '港澳来往内地通行证'
                case '07':
                  return '台湾同胞来往内地通行证'
                case '08':
                  return '临时身份证'
                case '09':
                  return '临时身份证'
                case '10':
                  return '警官证'
                case '99':
                  return '其它'
                default:
                  return '';
              }
            }
          },
          {
            title: "证件号码",
            dataIndex: "certNo",
            width: 160,
          },
          {
            title: "签约账号类型",
            dataIndex: "signAcctType",
            width: 150,
            customRender: (text, row, index) => {
              switch (text) {
                case "00":
                  return "本行借记账户";
                case "01":
                  return "本行贷记账户";
                case "02":
                  return "本行存折";
                case "03":
                  return "本行内部户";
                case "04":
                  return "本行对公户";
                case "10":
                  return "他行借记账户";
                case "11":
                  return "他行贷记账户";
                case "12":
                  return "他行存折";
                case "13":
                  return "他行内部户";
                case "14":
                  return "他行对公户";
              }
            }
          },
          // {
          //   title: "支付顺序号",
          //   dataIndex: "instId",
          //   hidden: true
          // },
          {
            title: "签约账号",
            dataIndex: "signAcctNo",
            width: 150,
          },
          {
            title: "银行预留手机号",
            dataIndex: "reserveMobileNo",
            width: 100,
          },
          {
            title: "签约银行行号",
            dataIndex: "signBankNo",
            width: 120,
          },
          {
            title: "签约银行名称",
            dataIndex: "signBankName",
            width: 100,
          },
          {
            title: "签约日期",
            dataIndex: "signDate",
            width: 80,
          },
          // {
          //   title: "签约流水号",
          //   dataIndex: "signExpiryDate",
          //   hidden: true
          // },
          {
            title: "签约有效期",
            dataIndex: "signExpiryDate",
            width: 80,
          },
          {
            title: "解约日期",
            dataIndex: "unsignDate",
            width: 80,
          },
          // {
          //   title: "解约流水号",
          //   dataIndex: "unsignSysSeqNum",
          //   hidden: true
          // },
          {
            title: "签约状态",
            dataIndex: "signStatus",
            width: 80,
            customRender: (text, row, index) => {
              switch (text) {
                case "Y":
                  return "签约";
                case "N":
                  return "解约";
              }
            }
          }, {
            title: "小额免密金额",
            dataIndex: "noPasswordAmt",
            width: 100,
          },
          {
            title: "多项认证限额",
            dataIndex: "authLimitAmt",
            width: 100,
          },
          {
            title: "单笔交易限额",
            dataIndex: "singleLimitAmt",
            width: 100,
          },
          {
            title: "日累计交易限额",
            dataIndex: "dayLimitAmt",
            width: 110,
          },
          {
            title: "操作",
            scopedSlots: { customRender: "operation" },
            fixed: "right",
            width: 100,
          },
        ],
        dataSource: [],
      };
    },

    methods: {
      async submit() {
        const res = await this.$refs.modalForm.submit();
        if (res) {
          this.modalVisible = false;
          this.pagination.defaultCurrent = 1;
          await this.search();
        }
      },

      async reset(){
        this.query = {instId:this.query.instId}
        this.pagination.pageNum = this.pagination.defaultCurrent;
        this.pagination.pageSize = this.pagination.defaultPageSize;
        await this.search();
      },
      async search(e) {
        e && e.preventDefault && e.preventDefault();
        try {
          const res = await this.$get("/admin/igas/SignAcctInfo/list", {
            instId: this.query.instId,
            signAcctNo: this.query.signAcctNo,
            certType: this.query.certType,
            certNo: this.query.certNo,
            pageNum: this.pagination.pageNum,
            pageSize: this.pagination.pageSize,
          });
          this.dataSource = res.data.rows;
          this.$set(this.pagination, "total", +res.data.total);
        } catch (e) {
          console.error(e);
        }
      },
      async rescind(record) {
        try {
          const res = await this.$post("/admin/igas/SignAcctInfo/rescind",
            {
            instId: record.instId,
            signToken: record.signToken,
            signTokenType: record.signTokenType,
            signInst: record.signInst,
          });
          console.log(res)
          if (res.status === 200){
            this.$message.success('解约成功!');
          }
          await this.search();
        } catch (e) {
          this.$message.error('解约失败!');
          console.error(e);
        }
      },
      pageChange(e) {
        this.pagination.pageNum = e.current;
        this.pagination.pageSize = e.pageSize;
        this.search();
      },
    },
  }
</script>
<style lang="less" scoped>
  @import "../../../../../static/less/Common";
</style>
